<? $this -> load -> view('header');?>
<script type="text/javascript" src="http://maps.google.com/maps/api/js?libraries=geometry&sensor=false"></script>
<script language="JavaScript">

	 function initialize() {
        var mapDiv = document.getElementById('map-canvas');
        var map = new google.maps.Map(mapDiv, {

          center: new google.maps.LatLng(14.91, 102.89),
          zoom: 8,
          mapTypeId: google.maps.MapTypeId.ROADMAP
        });
      }
      

      google.maps.event.addDomListener(window, 'load', initialize);
     
     function getGeography(){
			
		$('#geography').val("");
		$.get('<?=$current_module?>/geography', function(data) {
			var create = '<select id="dropdown_geolocation">';
			 create += '<option value="0">กรุณาเลือกภาค</option>';
			 $.each($.parseJSON(data), function() {
                create += '<option value="'+this.GEO_ID +'">'+this.GEO_NAME+'</option>';
		     });
		     create += '</select>';
		     $('#geography').html(create);
		     $('#dropdown_geolocation').change(function() {		
		     		$('#province').show();
		     		$('#province').val("");
		     		var createProvince = '<select id="dropdown_province">';
			 		createProvince += '<option value="0">กรุณาเลือกจังหวัด</option>';
		     		$.get('<?=$current_module?>/province',{geoid:$('#dropdown_geolocation').val()}, function(data) {
		     			$.each($.parseJSON(data), function() {
				             createProvince += '<option value="'+this.PROVINCE_ID +'">'+this.PROVINCE_NAME	+'</option>';
						 });
						createProvince += '</select>';
						$('#province').html(createProvince);
						   $('#dropdown_province').change(function() {	
						   	//amphur
						   	$('#amphur').show();
						   	$('#amphur').val("");
						
						   		$.get('<?=$current_module?>/amphur',{provinceid:$('#dropdown_province').val()}, function(data) {
						   			   	var createAmphur = '<select id="dropdown_amphur">';
			 				createAmphur += '<option value="0">กรุณาเลือกอำเภอ</option>';
				     				$.each($.parseJSON(data), function() {
				     					//alert(this.AMPHUR_ID );
						             	createAmphur += '<option value="'+this.AMPHUR_ID +'">'+this.AMPHUR_NAME	+'</option>';
									 });
									  createAmphur += '</select>';
								
									 $('#amphur').html(createAmphur);
									   $('#dropdown_amphur').change(function() {	
						 
						   				$('#district').show();
									   	$('#district').val("");
									   		$.get('<?=$current_module?>/district',{amphurid:$('#dropdown_amphur').val()}, function(data) {
									   			  	var createDistrict = '<select id="dropdown_district">';
									 				createDistrict += '<option value="0">กรุณาเลือกเขต</option>';
										     				$.each($.parseJSON(data), function() {
										     		
												             	createDistrict += '<option value="'+this.DISTRICT_ID +'">'+this.DISTRICT_NAME	+'</option>';
															 });
															  createDistrict += '</select>';
														
															 $('#district').html(createDistrict);
									   		});
									   });
												 
									 //district
								 });
								
						   });
		     		});
			 	
			});
		});
	
	
	}


	getGeography();


</script>
<style>
	
<!-- Here's the CSS code -->

div.my_wrapper{
    width: 630px;
}

div.my_left_box{
    float: left;
    padding: 10px;
 

}

div.my_right_box{
    float: right;
    padding: 10px;
    width: 325px;
}
</style>
<div id="middle">
	<? $this -> load -> view('land/left_menu');?>
	<div id="center-column">
		<div class="top-bar">
			 <div class="select-bar">
               
             
			<h1>การเรียกดูข้อมูลที่ดินโดยแบ่งตามข้อมูลเชิงสถิติวัดปริมาณผลผลิตที่ส่งเข้าโรงงาน</h1>
			 </div>
		
		</div>
		<div class="table">
			
			<table class="listing" cellpadding="0" cellspacing="0">
				<tr>
					<th style="width: 200px;"></th>
					<th>2554</th>
					<th>2555</th>
					<th>Change</th>
				</tr>
				<tr>
					<td>ปริมาณมันสดรวม</td>
					<td>1111</td>
					<td>1111</td>
					<td>0</td>
				</tr>
				<tr>
					<td>มันเส้นสด</td>
					<td>1111</td>
					<td>1111</td>
					<td>0</td>
				</tr>
			</table>
			<div class="my_wrapper">

			    <div class="my_left_box">
			    	<br />
			      <select>
							<option>เลือกปี</option>
							<option>2555</option>
							<option>2556</option>
						</select><br /><br />
						<table class="listing2" cellpadding="1" cellspacing="1" >
							<tr>
								<th style="width: 100px;">วันเดือนปี</th>
								<th>มันสด</th>
								<th>มันเส้น</th>
								<th>มูลค่ารวม(บาท)</th>
							</tr>
							<tr>
								<td>04/01/2555</td>
								<td>11</td>
								<td>22</td>
								<td>33</td>
							</tr>
						</table>
			    </div>
			
			    <div class="my_right_box">
			        <div id="map-canvas" style="width: 325px; height: 200px"></div>
			    </div>
				<div style="clear: both;"></div>
				<div>
					<table class="listing" cellpadding="1" cellspacing="1" >
							<tr>
								<th style="width: 100px;">No</th>
								<th>ชือเกษตรกร</th>
								<th>มันสด</th>
								<th>มันเส้น</th>
								<th>พื้นที่รวม(ไร่)</th>
								<th>มูลค่ารวม(บาท)</th>
							</tr>
							<tr>
								<td>0000001</td>
								<td></td>
								<td></td>
								<td></td>
								<td></td>
								<td></td>
							</tr>
							</table>
				</div>
			</div>
 

		
				
		</div>
	
	</div>
	<div id="right-column">
		<strong class="h">Quick Info</strong>
		<div class="box" >
			<span id="user_infor">
				พื้นที่เพาะปลูก
			</span>
		</div>
	</div>
</div>
<? $this -> load -> view('footer');?>